export default {
    data() {
        return {
            formView: false,
            dialogMode: true,
            loaded: false,
            loading: false,
            listData: [],
            form: {},
            page: {
                page: 1,
                total: 0,
                size: 10,
                sizes: [10, 20, 30, 50, 100]
            },
            api: {
                list: null,
                create: null,
                edit: null,
                del: null,
                changeStatus: null
            },
            pageRouter: {
                create: '', // name 如 permissionAdd
                edit: '' // name 如 permissionEdit
            },
            detailFormDialog: {
                visible: false,
                id: ''
            }
        }
    },
    methods: {
        refresh() {
            this.page.page = 1
            this.getDataList()
        },
        getDataList() {
            this.loading = true
            this.$api.post(this.api.list, {
                ...this.form,
                ...this.page
            }).then(res => {
                const data = res.data
                this.listData = data.data
                if (data.meta && data.meta.pagination) {
                    this.page = Object.assign(this.page, data.meta.pagination)
                    this.page.total = data.meta.pagination.totalCount
                }
            }).finally(() => {
                this.loading = false
            })
        },
        onCreate() {
            if (!this.dialogMode) {
                this.$router.push({
                    name: this.pageRouter.create
                })
            } else {
                this.detailFormDialog.id = ''
                this.detailFormDialog.visible = true
            }
        },
        onView(row) {
            this.formView = true
            this.detailFormDialog.id = row.id
            this.detailFormDialog.visible = true
        },
        onEdit(row) {
            if (!this.dialogMode) {
                this.$router.push({
                    name: this.pageRouter.edit,
                    params: {
                        id: row.id
                    }
                })
            } else {
                this.formView = false
                this.detailFormDialog.id = row.id
                this.detailFormDialog.visible = true
            }
        },
        onDel(row, params = null) {
            this.$confirm(`确认删除「${row.name || row.username || row.nickname || row.title || row.id}」吗？`, '确认信息')
                .then(() => {
                    this.$api.post(this.api.del, params || { id: row.id }).then(() => {
                        this.$message.success('删除成功')
                        this.refresh()
                    })
                })
                .catch(() => { })
        },
        onChangeStatus(row) {
            const target = row.status
            this.$confirm(`确认${target ? '启用' : '停用'}「${row.name || row.username || row.nickname || row.title}」吗？`, '确认信息').then(() => {
                this.$api.post(this.api.changeStatus, {
                    id: row.id,
                    status: target
                }).then(() => {
                    this.$message.success({
                        message: `${target ? '启用' : '停用'}成功`,
                        center: true
                    })
                })
            }).catch(() => {
                row.status = target ? 0 : 1
            })
        },
        back() {
            this.$router.go(-1)
        }
    }
}
